<template>
	<view class="Order">
			<view class="item" v-for="item in consten" :key="item">
				<view class="item_title">
					<view class="title_left">
					<view class="yuan" v-if="item.is_read==1"></view>
					{{ item.title }}</view>
					<view class="title_right">{{ item.date_add }}</view>
				</view>
				<view class="item_content">
					<image :src="item.goods_cover||'/pagesB/static/微信图片_20201124091755.png'" mode=""></image>
					<view class="ItemContent">
						<view class="title">{{ item.goods_name }}</view>
						<view class="parameter">
							<view class="parameter1">共{{ item.goods_count }}件商品</view>
						</view>
						<view class="parameter">
							<view class="parameter1">订单号：{{ item.order_sn }}</view>
						</view>
					</view>
				</view>
			</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			consten: [],
			model:'',
			access_token:''
		};
	},
	onShow() {
		let _this=this
		uni.getSystemInfo({
		    success: function (res) {
				_this.model=res.model
		    }
		});
		if(uni.getStorageSync('access_token')){
		this.access_token=JSON.parse(uni.getStorageSync('access_token'))
		}
		this.$request('/app/message/getOrderMessages', 'post', {
			page: this.page,
			t:this.model,
			access_token:this.access_token
		}).then(res => {
			if(res.errcode==0){
				function dateTO(data) {
					//data为时间戳
					var date = new Date(data);
					var Y = date.getFullYear() + '-';
					var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
					var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
					var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
					var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
					var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
					var strDate = Y + M + D + h + m + s; //转换为年月日时分秒
					// var strDate = Y + M + D; //转换为年月日
					return strDate;
				}
				res.content.forEach(v=>{
					v.date_add=dateTO(v.date_add * 1000)
				})
				this.consten=res.content
				}
		})
	},
	onReachBottom(){
		this.page=this.page++
		this.$request('/app/message/getOrderMessages', 'post', {
			page: this.page,
			t:this.model,
			access_token:this.access_token
		}).then(res => {
			if(res.data.errcode==0){
				function dateTO(data) {
					//data为时间戳
					var date = new Date(data);
					var Y = date.getFullYear() + '-';
					var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
					var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
					var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
					var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
					var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
					var strDate = Y + M + D + h + m + s; //转换为年月日时分秒
					// var strDate = Y + M + D; //转换为年月日
					return strDate;
				}
				res.content.forEach(v=>{
					v.date_add=dateTO(v.date_add * 1000)
				})
				res.data.content.forEach(v=>{
				this.consten.push(v)
	
				})
				}
		})
	}
};
</script>

<style lang="less">
.Order {
	height: 100%;
	background-color: #f3f4f5;
	padding-top: 20rpx;
	overflow-x: scroll;
	.item {
		background-color: #fff;
		margin-bottom: 20rpx;
		.item_title {
			display: flex;
			justify-content: space-between;
			padding: 20rpx;
			border-bottom: 1px solid #eeeeee;
			.title_left {
				display: flex;
				    align-items: center;
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #111111;
				.yuan{
					width: 18rpx;
					height: 18rpx;
					background: #DB1B22;
					border-radius: 50%;
				}
			}
			.title_right {
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #9da5a8;
			}
		}
		.item_content {
			display: flex;
			padding: 20rpx;
			border-bottom: 1px solid #eeeeee;
			image {
				height: 180rpx;
				width: 180rpx;
				margin-right: 16rpx;
			}
			.ItemContent {
				flex: 1;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				.title {
					height: 72rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #111111;
				}
				.parameter {
					height: 34rpx;
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #9da5a8;
				}
			}
		}
	}
}
</style>
